<template>
  <div>
    <el-card shadow="hover">
      <v-md-preview-html :html="html" preview-class="vuepress-markdown-body" />
    </el-card>
  </div>
</template>
      
<script lang="ts">
import { defineComponent, onMounted, reactive, toRefs } from "vue";

export default defineComponent({
  name: "MdPreviewHtml",
  setup() {
    const state = reactive({
      html: "",
    });

    onMounted(() => {
      const html = localStorage.getItem("mdPreviewHtml:html");
      if (html) {
        state.html = html;
      }
    });

    return {
      ...toRefs(state),
    };
  },
});
</script>
  
<style scoped>
</style>